<template>
    <div class="detailPage">
        <h2 class="title">{{title}}</h2>
        <p class="time">{{createTime}}</p>

        <div class="briefIntroduction">{{briefIntroduction}}</div>

        <p class="content">{{content}}</p>
    </div>
</template>

<script>
export default {
    name: 'noticeDetail',
    data() {
        return {
            title: '',
            briefIntroduction: '', //简介
            createTime: '', //time
            content: '',
        }
    },
    methods: {
        getDetail() {
            this.$http.post('/msg/notice/front/getNotice', {
                noticeId: this.$route.params.id
            }).then(res => {
                if (res.status === 0) {
                    this.title = res.data.title;
                    this.briefIntroduction = res.data.briefIntroduction;
                    this.createTime = res.data.createTime;
                    this.content = res.data.content;
                } else {
                    this.$toast.fail(res.message);
                }
            })
        }
    },

    mounted() {
        this.getDetail();
    }
}
</script>

<style lang="scss" scoped>
    .detailPage {
        height: 100%;
        background-color: #fff;
        padding: 20px 15px;

        > h2, > p {
            line-height: 1.7;
        }

        .time {
            color: #999;
            font-size: 14px;
        }

        .briefIntroduction {
            border-left: 4px solid #999;
            color: #999;
            font-size: 14px;
            padding-left: 10px;
            margin: 10px 0;
        }
    }
</style>
